<template>
    <div class="device">
         <el-tabs v-model="tabsValue" tab-position="left" style="width: 10%;height: left;" class="left" ><!-- @tab-click="handleClick" -->
            <el-tab-pane label="终端设备" name="device"></el-tab-pane>
            <!-- <el-tab-pane label="视频巡店" name="camera"></el-tab-pane> -->
            <el-tab-pane label="设备位置" name="shop"></el-tab-pane>
        </el-tabs>

        <keep-alive >
            <component :is="pageName"/>
        </keep-alive>
  
    </div>
</template>

<script>

import device from '@/views/device/device'
// import camera from '@/views/device/camera'
import shop from '@/views/device/shop'

export default {
    name: "datacenter",
    data() {
        return {
            tabsValue : 'device'
        };
    },
    components: {device, shop},
    created() {
    },
    mounted(){
    },
    computed: {
        pageName() {
            return this.tabsValue
        }
    },
    methods: {
    }
};
</script>
<style lang="scss" scoped>
.device {
    display: flex;
}
.left{
    height: 100%;
}
</style>